<template>
  <el-dialog title="新增部门" :visible.sync="dialogVisible" width="30%" :append-to-body="true">
    <el-form ref="addForm" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="部门名称" prop="name" label-width="100px">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
       <el-form-item label="负责人" label-width="100px"> 
        <el-select v-model="form.usrId"  style="width:100%">
          <el-option
            v-for="item in data"
            :key="item.OBJECT_ID"
            :label="item.USR_NAME"
            :value="item.OBJECT_ID"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="单位简称" prop="dwjc" label-width="100px">
        <el-input v-model="form.dwjc"></el-input>
      </el-form-item>
      <el-form-item label="排序值" prop="showOrders" label-width="100px">
        <el-input-number v-model="form.showOrders" :min="0"></el-input-number>
      </el-form-item>
      <el-form-item label="行政简称" prop="xzjc" label-width="100px">
        <el-input v-model="form.xzjc"></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="description" label-width="100px"> 
        <el-input type="textarea" v-model="form.description"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit('addForm')">保存</el-button>
        <el-button @click="dialogVisible = false">取 消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<script>
import { baseUrl } from "@/config/env";
const urls = {
  // checkField: baseUrl + "/backletter/common/check_unique", // 验证编码唯一性
  save: baseUrl + "/cp/dept/au-dept/add", // 保存
  list : baseUrl + "/cp/dept/au-dept/all_user_list"
};
export default {
  data() {
    return {
      dialogVisible: false,
      data:[],
      form: {
        name: null,
        description: null,
        xzjc :  null,
        usrId:null,
        dwjc : null,
        showOrders : null
      },
      rules: {
        name: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
        deptId: [
          { required: true, message: "请输入部门编码", trigger: "change" },
          { min: 3, max: 20, message: "长度必须为3-20个字符", trigger: "blur" },
          // {
          //   validator: (rule, value, callback) => {
          //     axios
          //       .get(urls.checkField, {
          //         params: { table: "t_depart", field: "code", value: value }
          //       })
          //       .then(res => {
          //         if (res.data.result) {
          //           callback("部门编码必须唯一");
          //         } else {
          //           callback();
          //         }
          //       });
          //   },
          //   trigger: "blur"
          // }
        ]
      }
    };
  },
  methods: {
    show() {
      this.dialogVisible = true;
      if (this.$refs["addForm"]) {
        this.$refs["addForm"].resetFields();
      }
       axios.post(urls.list).then(res => {
        this.data = res.data.result;
      })
    },
    onSubmit(formName) {
      // console.log(this.form);
       this.$refs[formName].validate(valid => {
         if (valid) {
          axios.post(urls.save, this.form).then(res => {
            this.$message(res.data.result);
            this.dialogVisible = false;
            this.$emit("refresh");
          });
         }
         return false;
       });
    }
  }
};
</script>